<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        /*
        了解面向对象
            面向对象是我们的一种开发方式
            面向过程：一种关注过程的开发方式
                =>在开发过程中，我们要关注每一个细节，步骤，顺序
            面向对象：一种面向对象的开发方式
                =>在开发过程中，我们看看有没有一个对象能帮我们完成任务
            例子：一份烤鸭
            +面向过程
                =>所有事情都是我们自己做的
                =>考虑顺序
                    ->先杀鸭子；先烤鸭子；先切鸭子
                =>考虑步骤
                    ->杀鸭子的时候，先干什么，后干什么
                =>考虑细节
                    ->胡萝卜，切宽窄程度
                    ->酱，咸淡口味
            +面向对象
                =>只需要点一份烤鸭
                =>等待结果
                
            开发过程中的例子：选项卡
            +面向过程
                =>考虑获取哪些元素
                =>考虑给那些元素绑定点击事件
                =>考虑点击的时候，做什么
            +面向对象
                =>考虑有没有一个对象能帮我们完成选项卡
                =>如果有，那么我就直接让这个对象帮我完成
                =>如果没有，我们就需要制造一个这样的对象来帮我完成 
            +我们需要一个 “机器” 
                =>这个机器能给我生产一个对象
                =>生产出来的对象能完成选项卡功能
                =>我们只要准备好这个机器就可以了
                =>本次开发过程中，我们制造机器，制造好以后，用机器生成一个对象完成选项卡
                =>当你第二次想进行选项卡开发的时候，那么我们不需要再次制造机器了
                =>只要用原先准备好的机器，再次制造一个新的选项卡对象
            +我们制造 ‘机器’ 的过程，就是面向对象封装的过程
                =>面向对象的核心：高内聚低耦合（就是对面向过程的高度封装）

            核心：
            +找到一个机器，能批量生产对象
            +生产出来的对象，每一个对象都有自己的属性和方法
            +每一个对象可能类似，但是内容不太一样
                =>构造函数
                =>可以批量成产对象
                =>可以像函数一样传递参数，可以给每一个对象添加一些不同的内容
                =>当你需要完成一个功能的时候，我们先制造一个构造函数
                    ->利用构造函数去创建一个可以完成任务的对象
                    ->依赖这个对象完成功能
            +这个 “机器” （构造函数）要生产有属性有方法的合理的对象
              => 机器：就是构造函数
              => 属性：直接写在构造函数体内
              => 方法：写在构造函数的原型上

            面向对象开发
            + 选项卡
            1.书写一个构造函数
            2.创建一个能够完成选项卡的对象
              => 属性：选项卡中能够点击的按钮
              => 属性：选项卡中用于切换的盒子
              => 方法：控制点击的按钮添加事件，给盒子进行切换操作
            3.使用构造函数创建一个选项卡对象
        */
    </script>
</body>
</html>